<template>
  <div>
    <Modal :title="L('AddCompany')" :value="value" @on-ok="save" @on-visible-change="visibleChange">
      <Form
        ref="FormData"
        label-position="right"
        :label-width="120"
        :rules="DataRule"
        :model="company"
      >
        <FormItem :label="L('company.imgUrl')" prop="imgurl">
          <uploadImg :uploadNum="1" @save-success="UploadImgSuccess"></uploadImg>
        </FormItem>
        <!-- 公司名称 -->
        <FormItem :label="L('company.Name')" prop="name">
          <Input v-model="company.name" :maxlength="50" :minlength="2"></Input>
        </FormItem>
        <!-- 公司类型 -->
        <FormItem :label="L('company.companyType')" prop="companyType">
          <Input v-model="company.companyType" :maxlength="50" :minlength="2"></Input>
        </FormItem>
        <!-- 负责人姓名 -->
        <FormItem :label="L('company.PrincipalsName')" prop="principalsName">
          <Input v-model="company.principalsName" :maxlength="50" :minlength="2"></Input>
        </FormItem>
        <!-- 负责人电话 -->
        <FormItem :label="L('company.PrincipalsTel')" prop="principalsTel">
          <Input v-model="company.principalsTel" :maxlength="50" :minlength="2"></Input>
        </FormItem>
        <!-- 邮箱地址 -->
        <FormItem :label="L('company.PrincipalsEmail')" prop="principalsEmail">
          <Input v-model="company.principalsEmail" :maxlength="50" :minlength="2"></Input>
        </FormItem>
        <!-- 上级公司 -->
        <FormItem :label="L('company.PidArr')" prop="pidArr">
          <Cascader :data="permissionTree" v-model="company.pidArr" filterable change-on-select></Cascader>
        </FormItem>
        <!-- 备注 -->
        <FormItem :label="L('company.Remark')" prop="remark">
          <Input v-model="company.remark" :maxlength="50" :minlength="2"></Input>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button @click="cancel">{{L('Cancel')}}</Button>
        <Button @click="save" type="primary">{{L('OK')}}</Button>
      </div>
    </Modal>
  </div>
</template>
<script lang="ts">
import { Component, Vue, Inject, Prop, Watch } from "vue-property-decorator";
import Util from "../../../lib/util";
import AbpBase from "../../../lib/abpbase";
import company from "../../../store/entities/company";
import uploadImg from "../../../components/upload/uploadImg.vue";

@Component({
  components: { uploadImg }
})
export default class Createcompany extends AbpBase {
  //=============================变量=============================
  @Prop({ type: Boolean, default: false }) value: boolean;
  @Prop() permissionTree: any;
  company: company = new company();
  pidArr = [];
  permissionTreeT = [
    {
      disabled: false,
      label: "根节点",
      order: 0,
      pid: null,
      value: "00000000-0000-0000-0000-000000000000"
    }
  ];
  //表单提交 为空提醒
  DataRule = {};
  //==================================方法=============================
  save() {
    (this.$refs.FormData as any).validate(async (valid: boolean) => {
      if (valid) {
        console.log(this.company);
        this.company.pid = this.company.pidArr.pop();
        var result = await this.$store.dispatch({
          type: "company/create",
          data: this.company
        });
        console.log(result);

        if (result.data.success == true) {
          (this.$refs.FormData as any).resetFields();
          this.$emit("save-success");
          this.$emit("input", false);
          this.$Notice.success({
            title: "成功",
            desc: "添加成功."
          });
        } else {
          this.$Notice.success({
            title: "失败",
            desc: "添加成功."
          });
        }
      }
    });
  }
  cancel() {
    (this.$refs.FormData as any).resetFields();
    this.$emit("input", false);
  }
  visibleChange(value: boolean) {
    if (!value) {
      this.$emit("input", value);
    }
    //console.log(this.permissionTree);
    //console.log("permissionTree");
  }
  UploadImgSuccess(file) {
    // console.log(file);
    // console.log("UploadImgSuccess");
    this.company.imgUrl = file.fileUrl;
  }
}
</script>

